/* 登录页思路分析
1.切换登录与注册盒子
2.登录功能
3.注册功能
*/

/*1.点击a标签：切换登录和注册盒子
    如果是登录盒子，点击切换注册盒子：隐藏登录，显示注册盒子
    如果是注册盒子，点击切换登录盒子：隐藏注册，显示登录盒子
    2.点击登录按钮：阻止form默认跳转
        (1)非空判断
        (2)正则判断：6-15位
        (3)发送ajax
        (4)服务器响应
            成功：跳转首页
            失败：弹窗提示

    3.点击注册按钮：阻止form默认跳转
        (1)非空判断
        (2)正则判断：6-15位
        (3)发送ajax
        (4)服务器响应
            成功：切换登录盒子
            失败：弹窗提示
*/

// 1.点击a标签：切换登录和注册盒子
//如果是登录盒子，点击切换注册盒子：隐藏登录，显示注册盒子
document.querySelector('.goRegister').addEventListener('click', function () {
    //登录盒子隐藏,注册盒子显示
    document.querySelector('.login').style.display = 'none'
    document.querySelector('.register').style.display = 'block'
})
//如果是注册盒子，点击切换登录盒子：隐藏注册，显示登录盒子
document.querySelector('.goLogin').addEventListener('click', function () {
    //注册盒子隐藏,登录盒子显示
    document.querySelector('.login').style.display = 'block'
    document.querySelector('.register').style.display = 'none'
})
/* 2.点击登录按钮：阻止form默认跳转
        (1)非空判断
        (2)正则判断：6-15位
        (3)发送ajax
        (4)服务器响应
            成功：跳转首页
            失败：弹窗提示 */
//获取表单
//登录
document.querySelector('.login button').addEventListener('click', function (e) {
    //阻止默认事件
    e.preventDefault()
    //非空判断
    const inputList = document.querySelectorAll('.login input')
    if (Array.from(inputList).some(item => item.value == '')) {
        return Toast.fail('输入框不能为空')
    }
    //正则判断
    if (Array.from(inputList).some(item => !/^\w{6,15}$/.test(item.value))) {
        return Toast.fail('账号密码6~15位')
    }
    //发送ajax
    axios({
        url: '/api/login',
        method: 'post',
        data: {
            username: document.querySelector('.login [name="username"]').value,
            password: document.querySelector('.login [name="password"]').value
        }
    }).then(res => {
        //成功回调
        // console.log(res)
        if (res.data.code === 0) {
            //(1)弹窗
            Toast.success(res.data.message)
            // (2)存贮taken到localStorage
            localStorage.setItem('mytoken', res.data.token)
            //(3)跳转首页
            location.href = './index.html'
        } else {
            Toast.info(res.data.message)
        }
    })
})
/* 3.点击注册按钮：阻止form默认跳转
        (1)非空判断
        (2)正则判断：6-15位
        (3)发送ajax
        (4)服务器响应
            成功：切换登录盒子
            失败：弹窗提示 */
document.querySelector('.register button').addEventListener('click', function (e) {
    //阻止默认事件
    e.preventDefault()
    //非空判断
    const inputList = document.querySelectorAll('.register input')
    if (Array.from(inputList).some(item => item.value == '')) {
        return Toast.fail('输入框不能为空')
    }
    //正则判断
    if (Array.from(inputList).some(item => !/^\w{6,15}$/.test(item.value))) {
        return Toast.fail('账号密码6~15位')
    }
    //发送请求
    axios({
        url: '/api/register',
        method: 'post',
        data: {
            username: document.querySelector('.register [name="username"]').value,
            password: document.querySelector('.register [name="password"]').value
        }
    }).then(res => {
        //成功回调
        console.log(res)
        if (res.data.code === 0) {
            //切换到登录页
            document.querySelector('.goLogin').click()
        } else {
            Toast.info(res.data.message)
        }

    })
})